<template>
  <div>
    <Hearder title="商品管理" listName="商品列表"></Hearder>
      <!-- 搜索 -->
   <el-form :inline="true" class="demo-form-inline">
     <el-form-item label="商品名称">
       <el-input v-model="search.name" placeholder="商品名称"></el-input>
     </el-form-item>
        <el-button type="primary" @click="fetchData">查询</el-button>
      </el-form-item>
    </el-form>
    
    <el-table
    :data="tableData"
    style="width: 100%">
    <el-table-column
      label="ID"
      prop="id">
    </el-table-column>
    <el-table-column
      label="商品名称"
      prop="name">
    </el-table-column>
    <el-table-column
      label="商品编号"
      prop="title">
    </el-table-column>
    <el-table-column
      label="商品图标"
     >
      <template slot-scope="scope">
        <img :src="scope.row.avatar" alt="" style="height: 3rem">
      </template>
    </el-table-column>

    <el-table-column
      align="right" label="操作">
      <template slot-scope="scope">
        <el-button
          size="mini"
          @click="$router.push('/goods/Edit/'+scope.row._id)">编辑</el-button>
          <!-- 把这一行的数据都穿过去 -->
        <el-button
          size="mini"
          type="danger"
          @click="Delete(scope.row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  <div>
      <el-pagination layout="total,prev, pager, next,jumper" :total="total" :page-size="pageSize" @current-change="fetchData"
      @size-change="fetchData"
      :current-page.sync="currentPage"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>

  export default {
   data(){
   	return {
       tableData: [],
       search: {
        name: '',

      },
      pageSize: 5,  
      currentPage: 1,
      total: 30,
      pojo: {},

    }
  },

   created(){
      this.fetchData()
   },
   methods: {
   	  async fetchData(){
        const  res =  await this.$http.post(`/api/brand/findPage.do?page=${this.currentPage}&size=${this.pageSize}`,this.search)
       this.tableData = res.data.rows;
       this.total =  res.data.total;
      },
      async Delete(row) {
         this.$confirm('是否确定要删除'+row.name+'分类?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {

          const res = await this.$http.post()
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          //删除成功 查询获取数据
          this.fetchData()
        })
      }
      
   }
}
</script>